<template>
	<view class="root-box root-container root-page-top">
		<uv-navbar @leftClick="goBack" placeholder bgColor="transparent" :fixed="false" ></uv-navbar>
		<view class="content">
			<view class="header-box">
				<uv-avatar :src="userInfo.avatar" size="60"/>
				<view class="header-item">
					<view class="user-box">
						<uv-text :text="userInfo.nickname" size="18" color="#333" bold style="padding-right: 10rpx;" />
						<view class="label-item">工匠</view>
					</view>
					<uv-text :text="'ID:'+userInfo.id" size="14" color="#333" style="" />
				</view>
			</view>
			
			<!-- <view class="item-back-box money-box mt-30">
				<view class="column-item">
					<view class="money-box-item-img-box" style="background-color: #fef0e0;">
						<image src='https://linshitong.oss-cn-shenzhen.aliyuncs.com/dev/image/2025/0822/eaebf202508221117224197.png'></image>
					</view>
					<view class="clight fz26 mt-10">
						累计收益 >
					</view>
					<view class="cdark fz38 fzW"> ￥500.00 </view>
				</view>
				
				<view class="column-item">
					<view class="money-box-item-img-box" style="background-color: #e6f0ff;">
						<image src='https://linshitong.oss-cn-shenzhen.aliyuncs.com/dev/image/2025/0822/798c2202508221135276409.png'></image>
					</view>
					<view class="clight fz26 mt-10">
						我的积分 >
					</view>
					<view class="cdark fz38 fzW"> 500 </view>
				</view>
				
			</view> -->
			
			<!-- <view class="item-back-box status-box mt-30">
				<view class="column-item">
					<view class="cdark fz38 fzW">600</view>
					<view class="flx-default mt-10">
						<view><tui-icon custom-prefix="lishitong" name="lishitong-dingdanshijian" size="20" color="red"></tui-icon></view>
						<view class="clight fz24" style="padding-left: 8rpx;">待确认</view>
					</view>
				</view>
				<view class="column-item"><view class="item-flx"></view></view>
				<view class="column-item">
					<view class="cdark fz38 fzW">600</view>
					<view class="flx-default mt-10">
						<view><tui-icon custom-prefix="lishitong" name="lishitong-dingdanshijian" size="20" color="red"></tui-icon></view>
						<view class="clight fz24" style="padding-left: 8rpx;">待处理</view>
					</view>
				</view>
				<view class="column-item"><view class="item-flx"></view></view>
				<view class="column-item">
					<view class="cdark fz38 fzW">600</view>
					<view class="flx-default mt-10">
						<view><tui-icon custom-prefix="lishitong" name="lishitong-dingdanshijian" size="20" color="red"></tui-icon></view>
						<view class="clight fz24" style="padding-left: 8rpx;">已完成</view>
					</view>
				</view>
			</view>    -->           
			<view class="icon-bar-box item-back-box">
				<!-- <view class="icon-bar-item-box border-b">
					<view class="flx-default ">
						<tui-icon custom-prefix="lishitong" name="lishitong-xiansuo" size="26" color="red"></tui-icon>
						<view  class="pl-10">线索管理</view>
					</view>
					<uv-icon name="arrow-right" color="#666" size="20"></uv-icon>
				</view> -->
				
				<view class="icon-bar-item-box border-b" @click.stop="onGoPage('/pages-user/help?feedback_type=3')">
					<view class="flx-default">
						<tui-icon custom-prefix="lishitong" name="lishitong-yijianfankui" size="20" color="red"></tui-icon>
						<view class="pl-10">意见反馈</view>
					</view>
					<uv-icon name="arrow-right" color="#666" size="20"></uv-icon>
				</view>
				
				<view class="icon-bar-item-box border-b" @click.stop="onGoPage('/pages-user/about')">
					<view class="flx-default ">
						<tui-icon custom-prefix="lishitong" name="lishitong-guanyu" size="24" color="red"></tui-icon>
						<view class="pl-10">关于我们</view>
					</view>
					<uv-icon name="arrow-right" color="#666" size="20"></uv-icon>
				</view>
				
				<!-- <view class="icon-bar-item-box">
					<view class="flx-default ">
						<tui-icon custom-prefix="lishitong" name="lishitong-shezhi" size="24" color="red"></tui-icon>
						<view class="pl-10">设置</view>
					</view>
					<uv-icon name="arrow-right" color="#666" size="20"></uv-icon>
				</view> -->
				
			</view>
			
			
			
			
			
				
			
        </view>
		<skilledNavbar :tabValue="tabValue"></skilledNavbar>
	</view>

</template>

<script setup>
	import {
		ref,
		onMounted
	} from 'vue'
	import {
		navigate
	} from '@/util/tools.js';
	import skilledNavbar from '../components/skilled_navbar.vue'
	import { useCustomBack } from '@/components/useCustomBack.js'
	
	
	import {
		storeToRefs
	} from 'pinia'
	import {
		useUserStore
	} from '@/store'
	import {
		getUserInfo
	} from '@/api'
	const user = useUserStore()
	const {
		token,
		userInfo
	} = storeToRefs(user)
	
	const { goBack } = useCustomBack('/pages-user/select_Identity')
	
	const tabValue = ref(3)
    const onGoPage=(url)=>{
		navigate(url)
	}
	
	
	
	
	
	

	
	
</script>
<style>
	
</style>
<style lang="scss" scoped>
	.root-box {

		.content {
			padding: 30rpx;
			box-sizing: border-box;

		}
	}
	
	.header-box{
		display: flex;
		align-items: center;
		margin-top: 30rpx;
		.header-item{
			margin-left: 20rpx;
			.user-box{
				display: flex;
				align-items: center;
				.label-item{
					
					background-color: red;
					border-radius: 15rpx 0 15rpx 0;
					padding: 4rpx 10rpx;
					box-sizing: border-box;
					color: #fff;
					font-size: 16rpx;
				}
			}
			
		}
		
	}
	
	.item-back-box{
		margin-top: 100upx;
		border-radius: 20upx;
		background-color: #fff;
		
	}
	
	.money-box{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 40upx 100upx;
		box-sizing: border-box;
	}
	
	.column-item{
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
	}
	
	
	
	.money-box-item-img-box{
		width:100upx;
		height: 100upx;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius:100upx;
		
	}
	
	.money-box-item-img-box image{
		width: 60upx;
		height: 60upx;
	}
	
	.status-box{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		padding: 20upx 60upx;
	}
	
	.item-flx{
		width: 2upx;
		height: 40upx;
		border-right: 1px solid #ccc;
		margin-top: 10upx;
	}
	
	.border-b{
		border-bottom: 1px solid #efefef;
	}
	
	.icon-bar-box{
		padding: 0 30upx;
		background-color: #fff;
	}
	
	.icon-bar-item-box{
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 28upx;
		color: #333;
		padding: 30upx 0;
		box-sizing: border-box;
	}
	
	
	
	
</style>